<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 
        如果下面这些js文件都是我们需要使用的，那么我们必须保证顺序不会错乱
        如果未来开发中项目比较复杂，搞出来几十个文件，那这个时候他们之间又会有互相的引用
        那就很难再去维持顺序了

        也许你会想，把它们搞成一个文件不就行了吗，但是你仔细想想，如果一个复杂的项目
        你只有一个js文件，那就会带来下面的问题：
            - 作用域问题: 可能不同的文件中都会在window上绑属性，搞不好就有命名冲突问题
            - 文件太大: 很容易理解，只有一个js文件，它里面是整个项目的所有内容，肯定大
            - 可读性差: 全写在一个文件里，动不动就几千行
            - 可维护性弱: 几千行甚至万行的代码，出了问题很难定位到问题的根源所在
     -->

    <!-- 外部引入的代码 -->
    <script src="https://cdn.bootcdn.net/ajax/libs/vue/3.2.47/vue.cjs.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/Chart.js/4.2.1/chart.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/socket.io/4.6.1/socket.io.esm.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.4.2/echarts.common.js"></script>

    <!-- 自己的js代码 -->
    <script src="./1.js"></script>
</head>
<body>
</body>
</html>